<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <!--[if IE]><meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'><![endif]-->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>OPHIUCHUS - Responsive Template</title>
    <meta name="description" content="Mobile Apps Landing Page for Marketing" />
    <meta name="keywords" content="mobile apps, landing page, responsive website, marketing"/>
    <meta name="author" content="Jenn Pereira"/>
    <link rel="icon" type="image/png" href="img/favicon.ico"/>

    <!-- Bootstrap -->
    <link href="css/bootstrap.min.css" rel="stylesheet">

    <link href="css/font-awesome.css" rel="stylesheet">
    <link href="css/flexslider.css" rel="stylesheet">
    <link rel="stylesheet" href="css/magnific-popup.css">
    <link rel="stylesheet" href="css/animate.css">

    <!-- My Style -->
    <link href="css/style.css" rel="stylesheet">
    <link href="css/responsive.css" rel="stylesheet">
    
    <script src="js/modernizr.custom.12691.js"></script>

    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
      <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->

  </head>
  <body>

  <!-- Preloader -->
  <div id="preloader">
    <div id="status">&nbsp;</div>
  </div>

  <!-- Navigation -->
  <section id="navigation" class="navbar-fixed-top not-visible-nav">
    <div class="menu-position">
      <div class="nav-logo"> 
        <a href="index.html" class="logo">
          <img src="img/nav-logo.png" alt="logo">
        </a>
      </div>

      <a class="mini-nav-button"><i class="nav-fa fa fa-bars"></i></a>

      <div class="nav-menu"> 
        <ul class="nav">
          <li class="active"><a href="#home" class="scroll">Home</a></li>
          <li class="#"><a href="#about" class="scroll">About</a></li>
          <li class="#"><a href="#features" class="scroll">Features</a></li>
          <li class="#"><a href="#team" class="scroll">Team</a></li>
          <li class="#"><a href="#screenshots" class="scroll">Screenshots</a></li>
          <li class="#"><a href="#downloads" class="scroll">Download</a></li>
          <li class="#"><a href="#contact" class="scroll">Contact</a></li>
        </ul>
      </div>
    </div>
  </section>

  <!-- Homepage -->
  <section id="home" class="banner" style="height: 750px;">
    <div id="bannerSlider" class="carousel carousel-fade slide" data-ride="carousel">

      <ol class="carousel-indicators waypoint">
        <li data-target="#bannerSlider" data-slide-to="0" class="active"></li>
        <li data-target="#bannerSlider" data-slide-to="1" class=""></li>
        <li data-target="#bannerSlider" data-slide-to="2" class=""></li>
        <li data-target="#bannerSlider" data-slide-to="3" class=""></li>
      </ol>

      <!-- Carousel -->
        <div class="carousel-inner">

          <div class="item active slider1">
            <div class="carousel-caption">
              <div class="container">
                <div class="col-md-12">
                  <div class="content">
                    <a href="#about" class="scroll wow bounceIn"><img src="img/logo.png" alt="mobile-apps"></a>
                    <br>
                    <div class="divider-top"></div>
                    <h1 class="wow bounce">WELCOME TO <span class="highlight">FORAPPS</span></h1>
                    <div class="divider"></div>
                    <h3>THE BEST WEB TEMPLATE </h3>
                    <h3>FOR YOUR MOBILE APP</h3>
                    <br>
                    <a href="#about" class="btn btn-learn btn-learna fa fa-plus scroll wow bounceInLeft">Learn More</a>
                    <a href="#downloads" class="btn btn-download btn-downloada fa fa-download scroll wow bounceInRight">Download</a>
                    <div class="phone1 wow bounceInUp" data-wow-delay="0.4s"></div>
                  </div>
                </div>
              </div>
            </div>
          </div>
                    

          <div class="item slider2">
            <div class="carousel-caption">
              <div class="container">
                <div class="col-md-12">
                  <div class="content">
                    <a href="#about" class="scroll wow bounceIn"><img src="img/logo.png" alt="mobile-apps"></a>
                    <br>
                    <div class="divider-top"></div>
                    <h1><span class="highlight">SIMPLE</span> WEB DESIGN</h1>
                    <div class="divider"></div>
                    <h3>THE BEST WEB TEMPLATE </h3>
                    <h3>FOR YOUR MOBILE APP</h3>
                    <br>
                    <a href="#about" class="btn btn-learn btn-learna fa fa-plus scroll wow bounceInLeft">Learn More</a>
                    <a href="#downloads" class="btn btn-download btn-downloada fa fa-download scroll wow bounceInRight">Download</a>
                    <div class="phone2 wow bounceInUp" data-wow-delay="0.4s"></div>
                  </div>
                </div>
              </div>
            </div>
          </div>

          <div class="item slider3">
            <div class="carousel-caption">
              <div class="container">
                <div class="col-md-12">
                  <div class="content">
                    <a href="#about" class="scroll wow bounceIn"><img src="img/logo.png" alt="mobile-apps"></a>
                    <br>
                    <div class="divider-top"></div>
                    <h1><span class="highlight">LOTS</span> OF FEATURES</h1>
                    <div class="divider"></div>
                    <h3>THE BEST WEB TEMPLATE </h3>
                    <h3>FOR YOUR MOBILE APP</h3>
                    <br>
                    <a href="#about" class="btn btn-learn btn-learna fa fa-plus scroll wow bounceInLeft">Learn More</a>
                    <a href="#downloads" class="btn btn-download btn-downloada fa fa-download scroll wow bounceInRight">Download</a>
                    <div class="phone3 wow bounceInUp" data-wow-delay="0.4s"></div>
                  </div>
                </div>
              </div>
            </div>
          </div>

          <div class="item slider4">
            <div class="carousel-caption">
              <div class="container">
                <div class="col-md-12">
                  <div class="content">
                    <a href="#about" class="scroll wow bounceIn"><img src="img/logo.png" alt="mobile-apps"></a>
                    <br>
                    <div class="divider-top"></div>
                    <h1><span class="highlight">RESPONSIVE</span> WEBSITE</h1>
                    <div class="divider"></div>
                    <h3>THE BEST WEB TEMPLATE </h3>
                    <h3>FOR YOUR MOBILE APP</h3>
                    <br>
                    <a href="#about" class="btn btn-learn btn-learna fa fa-plus scroll wow bounceInLeft">Learn More</a>
                    <a href="#downloads" class="btn btn-download btn-downloada fa fa-download scroll wow bounceInRight">Download</a>
                    <div class="phone4 wow bounceInUp" data-wow-delay="0.4s"></div>
                  </div>
                </div>
              </div>
            </div>
          </div>
                    
        </div>
                
    </div><!-- /.carousel -->
<a class="left carousel-control" href="#bannerSlider" data-slide="prev"><span class="glyphicon glyphicon-chevron-left"></span></a>
<a class="right carousel-control" href="#bannerSlider" data-slide="next"><span class="glyphicon glyphicon-chevron-right"></span></a>
    <div style="clear: both;"></div>
  </section>


  <!-- About -->
  <section id="about">
  <div class="container">
    <div class="col-md-12">

      <div class="about wow bounce">
        <h2>App Overview<span>Here goes your app overview and description</span></h2>
        <div class="divider add-bottom"></div>
      </div>

      <div class="col-md-4 col-sm-4 wow bounceIn" style="margin-top:-30px;">
        <img src="img/phones/1.png" class="img-responsive" alt="mobile-apps">
      </div>

      <div class="col-md-4 col-sm-4 add-top">
        <div class="list wow fadeInUp">
          <img class="flat-icons" src="img/icons/cog-icons.png" alt="flaticons">
          <h5>Bootstrap 3.1.1 Compatible</h5>
          <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
        </div>

        <div class="list wow fadeInUp" data-wow-delay="0.4s">
          <img class="flat-icons" src="img/icons/brush-icons.png" alt="flaticons">
          <h5>6 Colours Ready</h5>
          <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
        </div>
      </div>

      <div class="col-md-4 col-sm-4 add-top">
          <div class="list wow fadeInUp" data-wow-delay="0.2s">
            <img class="flat-icons" src="img/icons/pencil-icons.png" alt="flaticons">
            <h5>Unique Design</h5>
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
          </div>

          <div class="list wow fadeInUp" data-wow-delay="0.6s">
            <img class="flat-icons" src="img/icons/mobile-icons.png" alt="flaticons">
            <h5>Responsive Tamplate</h5>
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
          </div>
        </div>

    </div>
  </div>
  <div style="clear: both;"></div>
  </section>




  <!-- Feature -->
  <section id="features">
    <div class="container">
      <div class="col-md-12">

      <div class="features wow bounce add-bottom">
        <h2>Features<span>Tell us what Your Mobile App can offer people</span></h2>
        <div class="divider add-bottom"></div>
      </div>
    
        <div class="col-md-4 col-sm-4">
          <div class="list wow fadeInUp">
            <img class="flat-icons" src="img/icons/thumbsup-icons.png" alt="responsive">
            <h5>Simple and Clean Design</h5>
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
          </div>

          <div class="list wow fadeInUp" data-wow-delay="0.4s">
            <img class="flat-icons" src="img/icons/diamond-icons.png" alt="responsive">
            <h5>Fully Customable</h5>
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
          </div>
        </div>

        <div class="col-md-4 col-sm-4">
          <div class="list wow fadeInUp" data-wow-delay="0.2s">
            <img class="flat-icons" src="img/icons/html5-icons.png" alt="responsive">
            <h5>Valid HTML5 Mark-up</h5>
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
          </div>

          <div class="list wow fadeInUp" data-wow-delay="0.6s">
            <img class="flat-icons" src="img/icons/video-icons.png" alt="responsive">
            <h5>Support Video</h5>
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
          </div>
        </div>

        <div class="col-md-4 col-sm-4 wow bounceIn" style="margin-top:-30px;">
          <img src="img/phones/2.png" class="img-responsive" alt="responsive">
        </div>
      </div>
    </div>
    <div style="clear: both;"></div>
  </section>

  
  <!-- Call-To-Action -->
  <section id="action">
    <div class="container">
      <div class="col-md-12 center">
        <div class="content-action wow bounce">Are you ready to stand out?</div>
        <h3>Get Our Mobile Apps now! Free for 15 days trail!</h3> 
        <h3>Grab the mobile application today and get 50% discount! What are you waiting for?</h3>
        <br>
        <a href="#benefits" class="btn btn-learn btn-learna fa fa-plus scroll wow bounceInLeft">Learn More</a>
        <a href="#downloads" class="btn btn-download btn-downloada fa fa-download scroll wow bounceInRight">Download</a>
      </div>
    </div>
  </section>

  <!-- The Team -->
  <section id="team">
    <div class="container">
      <div class="col-md-12">

      <div class="team wow bounce add-bottom">
        <h2>Meat Our Team<span>Meet the genius people behind ForApps. Follow and socialise with the team!</span></h2>
        <div class="divider add-bottom"></div>
      </div>

        <ul class="grid cs-style-3 cs-hover">
          <li class="wow fadeInRightBig">
            <figure>
              <img src="img/team/1.png" alt="img01">
                <figcaption>
                  <h3>Lian Joy</h3>
                  <h5>Web Designer</h5>
                  <a href="#"><span class="social-icon fa fa-facebook-square fa-2x"></span></a>
                  <a href="#"><span class="social-icon fa fa-twitter-square fa-2x"></span></a>
                  <a href="#"><span class="social-icon fa fa-linkedin-square fa-2x"></span></a>
                  <a href="#"><span class="social-icon fa fa-google-plus-square fa-2x"></span></a>
                </figcaption>
            </figure>
          </li>

          <li class="wow fadeInUpBig">
            <figure>
              <img src="img/team/2.png" alt="img01">
                <figcaption>
                  <h3>Kres Tian</h3>
                  <h5>Senior Designer</h5>
                  <a href="#"><span class="social-icon fa fa-facebook-square fa-2x"></span></a>
                  <a href="#"><span class="social-icon fa fa-twitter-square fa-2x"></span></a>
                  <a href="#"><span class="social-icon fa fa-linkedin-square fa-2x"></span></a>
                  <a href="#"><span class="social-icon fa fa-google-plus-square fa-2x"></span></a>
                </figcaption>
            </figure>
          </li>

          <li class="wow fadeInLeftBig">
            <figure>
              <img src="img/team/3.png" alt="img01">
                <figcaption>
                  <h3>Cyr Errol</h3>
                  <h5>App Developer</h5>
                  <a href="#"><span class="social-icon fa fa-facebook-square fa-2x"></span></a>
                  <a href="#"><span class="social-icon fa fa-twitter-square fa-2x"></span></a>
                  <a href="#"><span class="social-icon fa fa-linkedin-square fa-2x"></span></a>
                  <a href="#"><span class="social-icon fa fa-google-plus-square fa-2x"></span></a>
                </figcaption>
            </figure>
          </li>
        
          <li class="wow fadeInRightBig">
            <figure>
              <img src="img/team/4.png" alt="img01">
                <figcaption>
                  <h3>Jenny Lyn</h3>
                  <h5>Manager</h5>
                  <a href="#"><span class="social-icon fa fa-facebook-square fa-2x"></span></a>
                  <a href="#"><span class="social-icon fa fa-twitter-square fa-2x"></span></a>
                  <a href="#"><span class="social-icon fa fa-linkedin-square fa-2x"></span></a>
                  <a href="#"><span class="social-icon fa fa-google-plus-square fa-2x"></span></a>
                </figcaption>
            </figure>
          </li>
        </ul>

      </div>
    </div>
    <div style="clear: both;"></div>
  </section>

  <!-- Benefits -->
  <section id="benefits">
    <div class="container">
      <div class="col-md-12">

      <div class="benefits wow bounce add-bottom">
        <h2>Apps Advantages<span>Tell Us More About Your Apps, Why It is Especial</span></h2>
        <div class="divider add-bottom"></div>
      </div>

        <div class="col-md-4 col-sm-4">
          <div class="list wow bounceInLeft">
            <img class="flat-icons" src="img/icons/pc-icons.png" alt="html5">
            <h5>12 Column Grid System</h5>
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
          </div>

          <div class="list wow bounceInLeft">
            <img class="flat-icons" src="img/icons/flag-icons.png" alt="html5">
            <h5>Font Awesome</h5>
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
          </div>

          <div class="list wow bounceInLeft">
            <img class="flat-icons" src="img/icons/search-icons.png" alt="html5">
            <h5>SEO Optimised</h5>
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
          </div>
        </div>

        <div class="col-md-4 col-sm-4 wow bounceIn" style="margin-top:-30px;">
          <img src="img/phones/3.png" class="img-responsive center" alt="html5">
        </div>

        <div class="col-md-4 col-sm-4">
          <div class="list wow bounceInRight">
            <img class="flat-icons" src="img/icons/rocket-icons.png" alt="html5">
            <h5>Animate CSS Effects</h5>
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
          </div>

          <div class="list wow bounceInRight">
           <img class="flat-icons" src="img/icons/coffee-icons.png" alt="html5">
            <h5>Clean Web Presentation</h5>
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
          </div>

          <div class="list wow bounceInRight">
            <img class="flat-icons" src="img/icons/papers-icons.png" alt="html5">
            <h5>Phone Mock-Ups</h5>
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
          </div>
        </div>

      </div>
    </div>
    <div style="clear: both;"></div>
  </section>

  

  <!-- Video Support -->
  <section id="video">
    <div class="row wow fadeIn">
      <div class="video-bg" style="padding-top:60px;">
        <a class="popup-vimeo" href="http://player.vimeo.com/video/66737183?title=0&amp;byline=0&amp;portrait=0&amp;color=ffffff"><i class="play-icon fa-play-circle-o fa-3x"></i></a>
      </div>
    </div>
    <div style="clear: both;"></div>
  </section>

  <div style="padding-top:80px;"></div>

  <!-- Screenshots -->
  <section id="screenshots">
    <div class="container"> 
      <div class="main">
        <div id="ac-wrapper" class="ac-wrapper">
          <h2>APPS IMAGES <span>Concept &amp; UI Design</span></h2>
          <div class="ac-device">
            <a href="#"><img src="img/screenshots/1.jpg" alt="screenshots"></a>
            <h3 class="ac-title">Gentrify small batch umami retro vegan</h3>
            <nav>
              <p>Click to toggle between single and grid view.</p> 
              <span>&lt;</span>
              <span>&gt;</span>
            </nav>
          </div>
          <div class="ac-grid">
            <a href="#"><img src="img/screenshots/1.jpg" alt="img1"><span>Line-icons for Design</span></a>
            <a href="#"><img src="img/screenshots/2.jpg" alt="img1"><span>Download Page Screenshot</span></a>
            <a href="#"><img src="img/screenshots/3.jpg" alt="img1"><span>Video Plugin Supported</span></a>
            <a href="#"><img src="img/screenshots/4.jpg" alt="img1"><span>Mobile Menu UI Design</span></a>
            <a href="#"><img src="img/screenshots/5.jpg" alt="img1"><span>Team Page in Mobile View</span></a>
            <a href="#"><img src="img/screenshots/6.jpg" alt="img1"><span>Simple Design For Apps</span></a>
            <a href="#"><img src="img/screenshots/7.jpg" alt="img1"><span>Subscription/ Newsletter</span></a>
            <a href="#"><img src="img/screenshots/8.jpg" alt="img1"><span>Cool Screenshots Page</span></a>
          </div>
        </div>       
      </div>
    </div><!-- /container -->
    <div style="clear: both;"></div>
  </section>

  <!-- Dowloads -->
<section id="downloads">
  <div class="container">
    <div class="col-md-12">
      <div class="downloads wow bounce add-bottom">
        <h2>Download The Apps Now!<span>Don’t be late to get the apps. Its available now!</span></h2>
        <div class="divider add-bottom"></div>
      </div>

      <div class="dowload-content wow fadeIn">
        Hello! Welcome to Ophiuchus! Ophiuchus is a premium mobile responsive HTML5 template designed and developed by Jenn Pereira for pereiradigitalmedia.com. It is a modern design, clean and easy to customize. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
      </div>

      <div class="appstore add-bottom">
        <a href="#" class="apps-btn wow fadeInRightBig"><img src="img/appstore.png" alt="apps"></a>
        <a href="#" class="apps-btn wow fadeInDownBig"><img src="img/googleplay.png" alt="apps"></a>
        <a href="#" class="apps-btn wow fadeInLeftBig"><img src="img/windows.png" alt="apps"></a>
        <br>
      </div>
      <br>
      <div class="divider"></div>
      <div id="apps-icon" class="wow fadeIn">
        <a href="#"><span class="apps-icon fa fa-apple fa-2x"></span></a>
        <a href="#"><span class="apps-icon fa fa-windows fa-2x"></span></a>
        <a href="#"><span class="apps-icon fa fa-android fa-2x"></span></a>
        <a href="#"><span class="apps-icon fa fa-html5 fa-2x"></span></a>
      </div>
      

    </div>
  </div>
  <div style="clear: both;"></div>
</section>

 <!-- Counter -->
  <section id="counter">
    <div class="container">
      <div class="col-md-12">
        <div class="col-md-3 col-xs-6">
          <h1 class="count">1121</h1>
          <h6>Users</h6>
        </div>

        <div class="col-md-3 col-xs-6">
          <h1 class="count">2013</h1>
          <h6>Register Members</h6>
        </div>

        <div class="col-md-3 col-xs-6">
          <h1 class="count">1009</h1>
          <h6>Downloads</h6>
        </div>

        <div class="col-md-3 col-xs-6">
          <h1 class="count">153</h1>
          <h6>Apps Created</h6>
        </div>
      </div>
    </div>
    <div style="clear: both;"></div>
  </section>

  <!-- Testimonials -->
  <section id="testimonials">
    <div class="quote">
      <div class="container">
        <div class="col-md-12">
        
        <div class="flexslider center">
          <ul class="slides">
            <li>
              <div class="testimonial">Welcome to Ophiuchus! Ophiuchus is a premium mobile responsive HTML5 template designed and developed by Jenn Pereira. It is a modern design, clean and easy to customize. </div>
              <div class="divider"></div>
              <img class="center" src="img/client/1.jpg" alt="client"><br>
              <span class="client-info">Jose Johnes </span><span>| Author</span>
              <div class="site-info">www.iwriterforlife.com</div>
            </li>

            <li>
              <div class="testimonial">We believe in working in partnership with our clients. We have forged strong and lasting relationships to deliver exceptional results.</div>
              <div class="divider"></div>
              <img class="center" src="img/client/2.jpg" alt="client"><br>
              <span class="client-info">Meridith Pereira </span><span>| CEO</span>
              <div class="site-info">www.cats-in-the-house.com</div>
            </li>
        
            <li>
              <div class="testimonial">We give our customers the best service no matter what your budget is and deliver professional work at competitive rates. We have fast turnaround times to meet your business demands working with highly skilled professionals.</div>
              <div class="divider"></div>
              <img class="center" src="img/client/3.jpg" alt="client"><br>
              <span class="client-info">Carlo Pereira </span><span>| CEO</span>
              <div class="site-info">www.dogs-in-the-house.com</div>
            </li>
          </ul>
        </div>
        </div>

      </div>
    </div>
    <div style="clear: both;"></div>
  </section>

<!-- Contact -->
  <section id="contact">
    <div class="container">
      <div class="col-md-12">

      <div class="contact wow bounce add-bottom">
        <h2>Contact us<span>We do our best to give you outstanding support and help.</span></h2>
        <div class="divider add-bottom"></div>
      </div>

    <div class="wow fadeIn">
      <div class="col-md-4" style="padding-top:20px; text-align:center;">
        <a class="popup-gmaps" href="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3920.0583380616117!2d122.54929799999998!3d10.72998399999998!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x33aee4d82b80eef7%3A0x1c5b598c2f3b43aa!2sCentral+Philippine+University!5e0!3m2!1sen!2s!4v1399513381994"><span class="map-icon fa fa-map-marker fa-3x"></span></a>
        <div class="contact-info">San Isidro, Lopez Jaena St.</div>
        <div class="contact-info">Jaro Iloilo City, Philippines 5000</div>
        <div class="contact-info">Tell: 0927-338-2289</div>
        <div class="contact-info">Email: jennpereira13(at)gmail.com</div>
        <a href="https://www.google.com/maps/place/Central+Philippine+University/@10.729984,122.549298,17z/data=!3m1!4b1!4m6!1m3!3m2!1s0x33aee4d82b80eef7:0x1c5b598c2f3b43aa!2sCentral+Philippine+University!3m1!1s0x33aee4d82b80eef7:0x1c5b598c2f3b43aa" class="map-btn btn-default map-btn">View Location on Google Map</a>
      </div>
    </div>


      <form action="contact.php"> <!-- Form -->
        <div class="wow fadeIn">
          <div class="col-md-4"> <!-- Left Form -->
            <input type="email" placeholder="Email" name="email" required="required" class="c-text" >
            <input type="text" placeholder="Name" name="name" required="required" class="c-text" >
            <input type="text" placeholder="Subject" name="subject" required="required" class="c-text" >
          </div> <!-- End Left Form -->
        </div>

        <div class="wow fadeIn">
          <div class="col-md-4"> <!-- Right Form -->
            <textarea name="message"  class="m-text" required="required" placeholder="Your Message" rows="3"></textarea>
            <button type="button" name="subscribe" class="send-text contact-btn">SEND MESSAGE</button>
          </div><!-- End Right Form -->
        </div>

      </form> <!-- End Form -->

      </div>
    </div>
    <div style="clear: both;"></div>
  </section>

  <!-- Subcription -->

<section id="subscription">
  <div class="container"> <!-- Container-->
    <div class="col-md-12"> <!-- 12 Column Grid-->
      <div class="col-md-4 wow bounceIn"> <!-- 4 Column Grid-->
        <img src="img/phones/4.png" class="img-responsive" alt="phone">
      </div> <!-- End 4 Column Grid-->

      <div class="col-md-8"> <!-- 8 Column Grid-->
        <h2 class="wow flipInX">Subscribe to our newsletter!</h2>
        <h3 class="wow flipInX">It is our duty to respond to all your queries, suggestions or feedback. We do our best to give you outstanding support and help.</h3>

        <div class="input-group">
          <input type="text" placeholder="Email" name="email" class="form-control subscribe-text">
          <button class="subscribe-btn btn-default" type="button">Subscribe!</button>
        </div><!-- /input-group -->

        <div class="copyrights add-bottom">2014 © Pereira Digital Media - All Rights Reserved.</div>
        
        <div class="wow fadeIn">
          <span class="footer-icon fa fa-facebook-square fa-3x"></span>
          <span class="footer-icon fa fa-twitter-square fa-3x"></span>
          <span class="footer-icon fa fa-linkedin-square fa-3x"></span>
          <span class="footer-icon fa fa-pinterest-square fa-3x"></span>
          <span class="footer-icon fa fa-flickr fa-3x"></span>
          <span class="footer-icon fa fa-google-plus-square fa-3x"></span>
        </div>

      </div> <!-- 8 Column Grid-->
    </div><!-- End 12 Column Grid-->
  </div> <!-- End Container-->
  <div style="clear: both;"></div>
  </section>


    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
    <script type="text/javascript" src="js/jquery-2.0.3.min.js"></script>
    
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script type="text/javascript" src="js/appshowcase_3.js"></script>
    <script type="text/javascript" src="js/jquery.flexslider-min.js"></script>
    <script type="text/javascript" src="js/dist/wow.js"></script>
    <script type="text/javascript" src="js/jquery.magnific-popup.js"></script>

    <script type="text/javascript" src="js/SmoothScroll.js"></script>
    <script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
    <script type="text/javascript" src="js/bootstrap.min.js"></script>
    <script type="text/javascript" src="js/toucheffects.js"></script>
    <script type="text/javascript" src="js/plugins.js"></script>


  </body>
</html>